<template>
<div>
  <h2>{{userId}}</h2>
  <h2>有缘江湖再见</h2>
  <h2>我这不就来见你了吗？</h2>
  <button @click="btnClick">按钮</button>
</div>
</template>


<!--
  route：路由 {
       path:'/Home',
       component:Home
    },就是一个路由
  router：路由器，这里的router相当于router实例对象  const router=new VueRouter()
        里面配置了很多个路由

-->

<script>
export default {
  name: "User",
  computed:{
    userId(){
      // 这里的route是：当前哪个路由出于活跃状态，拿到的就是哪个路由.
      //params.userID 就可以拿到当前活跃路由的 abc 相当于拿到的是 path:'/User/:abc',里的abc
      return this.$route.params.abc
    }
  },
  methods:{
    btnClick(){
      //所有的组件都继承自Vue类的原型prototype
      console.log(this.$router);
      console.log(this.$route);

      this.test();
    }
  },
  created() {
    console.log('user created');
    document.title='用户'
  },
}
</script>

<style scoped>

</style>
